<div class="modal-header bg-primary">
    <h3 class="modal-title">Create new Case</h3>
</div>
<div class="modal-body">
    <div class="mv-xs" ng-if="!!!dialog.state.hideEmptyCaseButton">
      <button class="btn btn-block btn-primary btn-lg" ng-click="dialog.next()">
          Empty Case
      </button>

      <p class="mv-m text-separator text-muted">OR</p>
    </div>

    <div class="box box-default">
      <div class="box-header">
        <h3 class="box-title">Select a template</h3>
        <div class="box-tools pull-right">
            <div class="has-feedback">
                <input type="text" ng-model="dialog.state.filter" class="form-control input-sm" placeholder="Filter templates" autofocus>
                <span class="glyphicon glyphicon-search form-control-feedback"></span>
            </div>
        </div>
      </div>
      <div class="box-body template-selector">
          <div class="empty-message" ng-if="dialog.filteredTemplate.length === 0">
              No templates found
          </div>
          <table class="table table-hover table-striped">
              <tbody>
                  <tr ng-repeat="template in dialog.filteredTemplate = (dialog.templates | filter:dialog.state.filter)"
                  class="clickable"
                  ng-class="{'active': dialog.state.selected === template.id}"
                  ng-click="dialog.next(template)">
                      <td>
                          <strong>{{template.name}}</strong><br>
                          <p class="list-group-item-text text-muted">{{template.description | ellipsis:200}}</p>
                      </td>
                  </tr>
              </tbody>
          </table>

      </div>
    </div>
</div>
<div class="modal-footer text-left">
    <button class="btn btn-default" ng-click="dialog.cancel()" type="button">Cancel</button>
</div>
